$(function () {

  var page1BL = 3000 / 1688
  var page2BL = 1920 / 770

  var MPageBL = 1080 / 1920

  var Middle  = 768
  var min     = 476
  var initTop = 0
  var $header = $('#header')
  var MT      = $header.height() + 50
  var $page1  = $('.page1')
  var $page3  = $('.page3')
  var is_min  = false
  var startX, startY, moveEndX, moveEndY, X, Y;   
  var mybody    = document.getElementsByTagName('body')[0]

  $('body').find('img').removeAttr('width').removeAttr('height')   

  $(window).on('resize', (function autoHeight() {
    var width = window.innerWidth
    if(width > Middle) {
      $page1.height(~~(window.innerWidth / page1BL))
      $page3.height(~~(window.innerWidth / page2BL))
    } else {
      $page1.height(~~(window.innerWidth / MPageBL))
      $page3.height(~~(window.innerWidth / MPageBL))
    }

    if(width < min) {
      $('body').on("touchmove", a())
    }
    return autoHeight
  })())

  mybody.addEventListener('touchmove', a())  
  $(window).on('scroll', a()) 

  function a() {
    var newTop = document.documentElement.scrollTop
      if(newTop > MT) {
         if(newTop - initTop > 0) {
            if($header.hasClass('b'))
              $header.removeClass('b')
         } else {
            if(!$header.hasClass('b')) 
              $header.addClass('b')
         }
      } else {
        if($header.hasClass('b'))
          $header.removeClass('b')
      }

      initTop = newTop

      return a
  }

  // mybody.addEventListener('touchstart', function(e) {
  //     startX = e.touches[0].pageX
  //     startY = e.touches[0].pageY
  // })
  

  var $header = $('#header');

  var $linkHover = $header.find('.link-hover')


  $linkHover.on('click', function () {
    
    if($(this).attr('data-sub') != 0){
      if (!this.isBtn) {
        $header.find('.down-menu').eq(($(this).attr('data-index') * 1)).addClass('active').siblings('.down-menu').removeClass('active')
        $(this).addClass('active').siblings('.link-hover').removeClass('active')
        $linkHover.each(function(index, item){
          item.isBtn = false
        })

        this.isBtn = true
      } else {
        $header.find('.down-menu').eq(($(this).attr('data-index') * 1)).removeClass('active').siblings('.down-menu').removeClass('active')
        $(this).removeClass('active').siblings('.link-hover').removeClass('active')
        this.isBtn = false;
      }

      return false
    }
    
  })

  $header.find('.down-menu').on('mouseenter', function () {
    $linkHover.find('.link').eq($(this).index()).addClass('active').siblings('.link-hover').removeClass('active')
    return false
  })

  $header.find('.down-menu').on('mouseleave', function () {
    $linkHover.eq($(this).index()).removeClass('active').find('.link').removeClass('active')
    $linkHover.eq($(this).index()).get(0).isBtn = false
    $(this).removeClass('active')
    return false
  })


  // $('#header').find('.link-hover').on('mouseleave', function () {
  //   $('#header').find('.link-hover').removeClass('active')
  //   $('#header').find('.down-menu').removeClass('active')
  // })
  //
  // $('#header').find('.down-menu').on('mouseenter', function () {
  //   $('#header').find('.link-hover').eq($(this).index() - 2).addClass('active').siblings('.link-hover').removeClass('active').prevObject.find('.link').addClass('active')
  //   $(this).addClass('active')
  // })
  //
  // $('#header').find('.down-menu').on('mouseleave', function () {
  //   $(this).removeClass('active')
  //   $('#header').find('.menu-item').removeClass('active').find('.link').removeClass('active')
  // })
  //
  //
  // $('#header').find('.link-hover').on('mouseenter', function () {
  //   $(this).addClass('active').siblings('.link-hover').removeClass('active')
  //   $('#header').find('.down-menu').eq(($(this).attr('data-index') * 1) - 1).addClass('active').siblings('.down-menu').removeClass('active')
  //
  // })


  var animate = ['animate1', 'animate2']
  var animated = $('.page').find('.animated')
  var isFadeIn = false
  $(document).on('scroll', loadClass())


  $('#header').find('.min-menu-ico').click(function () {
    if (!this.isShow) {
      $('.min-menu-down').fadeIn(500)
      this.isShow = true;
    } else {
      $('.min-menu-down').hide()
      this.isShow = false
    }
    $(this).toggleClass('active')

    return false
  })

  $('.min-menu-down').find('.down-ico').click(function() {
    $('.min-menu-down').slideUp()
    $('.min-menu-ico').removeClass('active').get(0).isShow = false
  })
  

  function loadClass() {

    if(!isFadeIn){
      $('.page1').find('.text-box').find('.transiti').addClass('fadeIn')
      isFadeIn = true
    }

    for (var i = 0, len = animated.length; i < len; i++) {
      var item = animated[i];
      if (getElementTop(item) <= (window.innerHeight + $(document).scrollTop()) - 50 && !item.isLoad) {
        $(item).addClass(animate[Math.round(Math.random())]).addClass('active')
        item.isLoad = true
      }
    }
    return loadClass
  }

  function getElementTop(el) {
    var top = el.offsetTop;
    var oParent = el.offsetParent;
    while (oParent != null) {
      top += oParent.offsetTop;
      oParent = oParent.offsetParent
    }
    return top
  }
})